;(function(){
    "use strict"
    // document.addEventListener("load",function(){
    // 收藏夹弹出框------------------------------
    var souchang=document.querySelector(".shouchangjia")
    var tanSou=document.querySelector(".tanshou")
    console.log(tanSou);
    souchang.addEventListener("mouseover",function(){
        tanSou.style.display="block"
        this.style.background="white"
    })
    souchang.addEventListener("mouseout",function(){
        tanSou.style.display="none"
        this.style.background="#f2f2f2"
    })
    // 我的淘宝弹出框--------------------------------
    var wotao=document.querySelector(".wodetaobao")
    var tantao=document.querySelector(".tantao")
    wotao.addEventListener("mouseover",function(){
        tantao.style.display="block"
        this.style.background="white"
    })
    wotao.addEventListener("mouseout",function(){
        tantao.style.display="none"
        this.style.background="#f2f2f2"
    })
    // 手机版弹出框------------------------------------
    var shouji=document.querySelector(".shouji")
    var shoutan=document.querySelector("#shoujiban")
    shouji.addEventListener("mouseover",function(){
        shoutan.style.display="block"
        // this.style.background="white"
    })
    shouji.addEventListener("mouseout",function(){
        shoutan.style.display="none"
        // this.style.background="#f2f2f2"
    })
    // 商家弹出框-----------------------------------
    var shangjia=document.querySelector(".shangjia")
    var shangtan=document.querySelector(".tanshang")
    shangjia.addEventListener("mouseover",function(){
        shangtan.style.display="block"
        this.style.background="white"
    })
    shangjia.addEventListener("mouseout",function(){
        shangtan.style.display="none"
        this.style.background="#f2f2f2"
    })
    // 导航弹出框-----------------------------------
    var daohang=document.querySelector(".wangzhan")
    var daotan=document.querySelector(".tandao")
    daohang.addEventListener("mouseover",function(){
        daotan.style.display="block"
        this.style.background="white"
    })
    daohang.addEventListener("mouseout",function(){
        daotan.style.display="none"
        this.style.background="#f2f2f2"
    })
    // 轮播图效果-----------------------------------
    //第一步、进入显示左右箭头
    var zuojian=document.querySelector(".zuojian")
    var youjian=document.querySelector(".youjian")
    var tupian=document.querySelector(".tupian")
    tupian.addEventListener("mouseover",function(){
        zuojian.style.display="block"
        youjian.style.display="block"
        clearInterval(t)
        t=null      //清除计时器变量
    })
    tupian.addEventListener("mouseout",function(){
        zuojian.style.display="none"
        youjian.style.display="none"
        t=setInterval(function(){
            youjian.click()
        },2000)
    })
    //第二部同步图片和按钮数
    var ul=tupian.querySelector("ul")
    var dian=document.querySelector(".liudian")
    var tuwidth=tupian.offsetWidth
    // console.log(ul);
    for(var i=0;i<ul.children.length-1;i++){
        var b=document.createElement("b")
        b.setAttribute("index",i)
        dian.appendChild(b)
        b.innerHTML=i+1
        b.addEventListener("mouseover",function(){
            for(i=0;i<ul.children.length-1;i++){
                dian.children[i].className=""
            }
            this.className="current"
            var index=this.getAttribute("index")
            //解决xiaobug
            num=index
            dian1=index
            animate(ul,-tuwidth*index)
        })
    }
    dian.children[0].className="current"
    // var first=ul.children[0].cloneNode(true)
    // ul.appendChild(first)
    // 右键绑定图片
    var num=0
    var dian1=0
    
    youjian.addEventListener("click",function(){
        if(num==dian.children.length){
            ul.style.left=0
            num=0
        }
        num++
        animate(ul,-tuwidth*num)
        dian1++
        if(dian1==ul.children.length-1){
            dian1=0
        }
        chang()
    })
    zuojian.addEventListener("click",function(){
        if(num==0){
            num=dian.children.length
            ul.style.left=-num*tuwidth+"px"
        }
        num--
        animate(ul,-tuwidth*num)
        dian1--
        if(dian1<0){
            dian1=dian.children.length-1
            
        }
        chang()
    })
    function chang(){
        for(var j=0;j<dian.children.length;j++){
            dian.children[j].className=""
        }
        dian.children[dian1].className="current"
    }
    var t=setInterval(function(){
        youjian.click()
    },2000)
    
    // 二级菜单
    var erji=document.querySelector(".chanleft")
    var li=erji.querySelectorAll("li")
    // var erji1=document.querySelector(".erji1")
    
    // console.log(li)
    for(var i=0;i<li.length;i++){
        li[i].addEventListener("mouseover",function(){
            var as=this.querySelectorAll("li>a")
            var span1=this.querySelectorAll("span")
            var erji1=this.querySelector(".erji1")

            // for(var i=0;i<li.length;i++){
            //     for(var j=0;j<as.length;j++){
                    // li[i].children.style.color="#e22a40"
                //    as[j].style.color="#999"
                // }
                // li[i].span1[1].style.color="#e22a40 "
                // li[i].span1[0].style.color="#e22a40 "
            // console.log(li[i].span1[i]);
            // }
            
            for(var j=0;j<as.length;j++){
                as[j].style.color="white"
                
            }
            span1[1].style.color="white "
            span1[0].style.color="white "
            erji1.style.display="block"
            
        })
        li[i].addEventListener("mouseout",function(){
            var erji1=this.querySelector(".erji1")
            var as=this.querySelectorAll("li>a")
            var span1=this.querySelectorAll("span")
            // for(var i=0;i<li.length;i++){
                //     for(var j=0;j<as.length;j++){
                    // li[i].children.style.color="#e22a40"
                    //    as[j].style.color="#999"
                    // }
                    // li[i].span1[1].style.color="#e22a40 "
                    // li[i].span1[0].style.color="#e22a40 "
                    // console.log(li[i].span1[i]);
                    // }
                    
                    for(var j=0;j<as.length;j++){
                        as[j].style.color="#999"
                        
                    }
                    span1[1].style.color=" #999 "
                    span1[0].style.color="#e22a40 "
                    erji1.style.display="none"
            
        })
    }





    // 漂浮窗---------------------------------
    var piaofu=document.querySelector(".piaofu")
    var a111=document.querySelector(".piaofu .a111")
    var a12=document.querySelector(".piaofu .a12")
    var a13=document.querySelector(".piaofu .a13")
    var a14=document.querySelector(".piaofu .a14")
    var a15=document.querySelector(".piaofu .a15")
    var as=document.querySelectorAll(".piaofu a")
    document.addEventListener("scroll",function(){
        // console.log(as)
        if(window.pageYOffset>450){
            piaofu.style.display="block"
        }else{
            piaofu.style.display='none'
        }
        if(window.pageYOffset>450 && window.pageYOffset<=1200){
            a111.style.background="red"
            a111.style.color="white"
        }else{
            a111.style.background="white"
            a111.style.color="#666"
        }
        if(window.pageYOffset>1200 && window.pageYOffset<=1850){
            a12.style.background="red"
            a12.style.color="white"
        }else{
            a12.style.background="white"
            a12.style.color="#666"
        }
        if(window.pageYOffset>1850 && window.pageYOffset<=2500){
            a13.style.background="red"
            a13.style.color="white"
        }else{
            a13.style.background="white"
            a13.style.color="#666"
        }
        if(window.pageYOffset>2500 && window.pageYOffset<=3150){
            a14.style.background="red"
            a14.style.color="white"
        }else{
            a14.style.background="white"
            a14.style.color="#666"
        }
        if(window.pageYOffset>3150 ){
            a15.style.background="red"
            a15.style.color="white"
        }else{
            a15.style.background="white"
            a15.style.color="#666"
        }

    })
    for( var q=0;q<as.length;q++){
        as[q].addEventListener("mouseover",function(){
            this.style.background="red"
            this.style.color="white"
        })
    }
    for( var q=0;q<as.length;q++){
        as[q].addEventListener("mouseout",function(){
            this.style.background="white"
            this.style.color="#666"
        })
    }
    // for(var a=0;a<as.length-2;a++){
        a111.addEventListener("click",function(){
            // window.scroll=(890,0)
            // var gao=a*650
            anim(window,850)
            // console.log(gao);
        })
        a12.addEventListener("click",function(){
            anim(window,1500)
        })
        a13.addEventListener("click",function(){
            anim(window,2150)
        })
        a14.addEventListener("click",function(){
            anim(window,2800)
        })
        a15.addEventListener("click",function(){
            anim(window,3430)
        })
    // }



    // ------------------------------------------------------
    var guding1=document.querySelector(".guding1")
    document.addEventListener("scroll",function(){
        if(window.pageYOffset>224){
            guding1.style.position="fixed"
            guding1.style.top="0"
            guding1.style.borderBottom="1px solid #666"
        }else{
            guding1.style.position="relative"
            guding1.style.top=""
            guding1.style.borderBottom=" 0px"

        }
    })
    // 购物车
    var che=document.querySelector(".che")
    che.addEventListener("mouseover",function(){
        $(".che").animate({width:260})
        // console.log($(this));/
    })
// })
})();